<template>
  <div>
    <p>欢迎光临_vue开发的收银系统_水果店</p>
    <table>
      <tr>
        苹果10¥/斤，折扣8折
      </tr>
      <tr>
        请输入你要购买的斤数
        <input type="text" v-model="msg1" />
      </tr>
      <tr>
        <button @click="fn1">结账买单～</button>
      </tr>
      <tr>
        结账单：总价
        {{
          msg * 10
        }}¥元 折后价：{{
          msg * 10 * 0.8
        }}
        ¥元 省了：
        {{
          msg * 10 - msg * 10 * 0.8
        }}¥元
      </tr>
    </table>
  </div>
</template>

<script>
export default {
  components: {},
  props: {},
  data() {
    return {
      msg: 0,
      msg1: 20,
    };
  },
  computed: {},
  watch: {},
  created() {},
  methods: {
    fn1() {
      this.msg = this.msg1;
    },
  },
};
</script>

<style scoped></style>
